﻿.ddlImages-container
{
    height:600px;
	width:350px;
    margin-top:5px;
    color:Black;
}

.ddlImages-selected
{
	width:370px;
	height:25px;
    margin-bottom:2px;
}
.display-selected-img
{
    width:700px;
    height:550px;
    background-color:Gray;
    clear:both;
}

.ddlImages-selector
{
	position:relative;	
	float:left;
    width:280px;
}

.ddlImages-selector.hover:before
{
    background-color:#D9D9D7;
    border-left:1px solid #B6BABF;
}

.ddlImages-selector:before
{
	content:"";
	cursor:pointer;
	position:absolute;
	top:-4px;
	left:274px;
	width:38px;
	height:37px;
	-webkit-transform: scale(0.6,0.6);
	transform: scale(0.6,0.6);
	-ms-transform: scale(0.6,0.6);
    background-image:url(/Images/Test/arrow_down.png);
    background-position:center;
    background-repeat: no-repeat;
    border-left:1px solid transparent;
}

.ddlImages-selected input
{
    border: 1px solid #B6BABF;
    font-family: Calibri;
    font-size: 16px;
    padding: 2px;
	width:300px;
	margin-bottom:2px;
	margin-top:2px;
	height:19px;
}
.ddlImages-selected input[type="submit"]
{
	height:25px;
	color:#B6BABF;
	cursor:pointer;
	width:55px;
}

.ddlImages-select-butt
{
    float:left;
    margin-left:30px;
}
.ddlImages
{
    position: absolute;
    overflow:hidden;
}

.ddlImages > div
{
    position:relative;
    top:-391px;
    width:304px;
    height: 390px;
    overflow-x: hidden;
    overflow-y: auto;
	background-color: #cccccc;
	border-left:1px solid rgb(165,165,165);
	border-right:1px solid rgb(165,165,165);
	border-bottom:1px solid rgb(165,165,165);
}

.ddlImages-item
{
	border:1px solid rgb(165,165,165);
    background-color:white;
	margin:8px;
	margin-left:0px;
	margin-right:0px;
	margin-left:4px;
	margin-right:4px;
	padding:2px;
}

.ddlImages-item > div:first-child
{
    float:left;
	width:80px;
    margin-right:25px;
}

.ddlImages-navigation {
    text-align:center;
}
.ddlImages-navigation > div {
    display:inline-block;
}
.ddlImages-navigation > div  > div{
    float:left;
}

.ddlImages-navigation div.selected
{
    cursor:default;
    background-color:black !important;
}

.ddlImages-navigation div.selected > a
{
    cursor:default;
    color:White !important;
}

.ddlImages-navigation div.inbetween-butt > div{
    cursor:pointer;
    margin-left:3px;
    margin-right:3px;
    float: left;
    background-color:White;
    border-radius: 3px;
    width:21px;
    font-weight:bold;
}

.ddlImages-navigation  div.inbetween-butt > div > a
{
    text-decoration:none;
    color:Black;
}
.previous-butt, 
.next-butt
{
    cursor:pointer;
    background-color:White;
    height:16px;
    width:19px;
    padding-top:1px;
    padding-bottom:1px;
    border-radius: 3px;
}

.previous-butt{
    padding-right:1px;
    margin-right:20px;
}

.next-butt{
    margin-left:20px;
    padding-left:1px;
}
.next-butt > input, 
.previous-butt > input{
    width:12px;
    height:12px;
}